import elUtil from "../utils/elUtil.js";
import {out_data_vue} from "../layout/components/outDataVue.js";

/**
 * 判断是否是订单管理页面
 * @param url {string}
 * @returns {boolean}
 */
const isOrderManagementPage = (url = window.location.href) => {
    return url.includes('ksjhaoka.com/#/ordermanage/order');
}


/**
 * 传入网页元素获取订单号和下单时间
 * @param trEl {Element|Document}
 * @returns {{}}
 */
const getOrderNumberAndOrderingTime = (trEl) => {
    const mr10Els = trEl.querySelectorAll('.disply-flex>span');
    const data = {}
    for (let el of mr10Els) {
        const splits = el.textContent.trim().split('：');
        data[splits[0]] = splits[1].trim();
    }
    return data
}


//获取商品信息
const getProductInformation = (divEls) => {
    const data = {}
    for (let i = 0; i < divEls.length; i++) {
        const divEl = divEls[i];
        if (i === 0) {
            data['商品名称'] = divEl.querySelector('span').textContent.trim()
        }
        const splits = divEl.textContent.trim().split("：");
        data[splits[0]] = splits[1].trim();
    }
    return data
}


const getListData = async () => {
    const el = await elUtil.findElement('.el-table__body-wrapper.is-scrolling-left>table')
    const trEls = el.querySelectorAll("tbody>tr");
    const list = [];
    let data = {}
    for (let trEl of trEls) {
        //订单号和下单时间
        if (trEl.className === 'el-table__row expanded') {
            const numberAndOrderingTime = getOrderNumberAndOrderingTime(trEl);
            for (let key in numberAndOrderingTime) {
                data[key] = numberAndOrderingTime[key];
            }
            continue
        }
        //其他项
        const expandColumn = Array.from(trEl.querySelectorAll('.expand-column'));
        for (let i = 0; i < expandColumn.length; i++) {
            const el = expandColumn[i]
            const divEls = el.querySelectorAll('.table-list>div');
            if (i === 4) {
                //失败原因
                continue
            }
            if (i === 0) {
                //商品信息
                const productInformation = getProductInformation(divEls);
                for (let key in productInformation) {
                    data[key] = productInformation[key]
                }
                continue
            }
            if (i === 3) {
                //状态中的短信
                const elButEl = el.querySelector('.el-button');
                const ariaDescribedbyId = elButEl.getAttribute('aria-describedby');
                const timeSpan = elButEl.querySelector('span');
                if (timeSpan) {
                    data['短信时间'] = timeSpan.textContent.trim()
                }
                const tipEl = document.querySelector(`#${ariaDescribedbyId}`);
                if (tipEl) {
                    data['短信'] = tipEl.textContent.trim()
                }
            }
            if (i === 1 || i === 2 || i === 3) {
                //购卡信息和生产信息和状态(不包括状态的短信)
                for (let el of divEls) {
                    const elText = el.textContent.trim();
                    let txtArr = elText.includes('：') ? elText.split('：') : elText.split(':');
                    data[txtArr[0]] = txtArr[1].trim();
                }
                continue
            }
            if (i === 4) {
                data['失败原因'] = el.textContent.trim()
                continue
            }
            if (i === 5) {
                data['商家备注'] = el.textContent.trim();
            }
        }
        //其他信息
        list.push(data)
        data = {}
    }
    return list
}


/**
 * 订单管理组件
 */
export const order_management_vue = {
    template: `
      <div>
      <el-card>
        <span>数据信息</span>
        <el-badge :value="dataList.length" type="primary">
          <el-button size="small">数据</el-button>
        </el-badge>
      </el-card>
      <out_data_vue file-name="订单列表" :data-list="dataList"/>
      <el-card>
        <el-button @click="getListDataBut">获取列表数据(当前页)</el-button>
      </el-card>
      </div>`,
    components: {
        out_data_vue,
    },
    data() {
        return {
            dataList: []
        }
    },
    methods: {
        getListDataBut() {
            getListData().then(list => {
                this.dataList = list
                this.$alert('获取当前页订单成功')
            })
        }
    }
}

export default {
    isOrderManagementPage
}
